<%@ include file="/common/taglibs.jsp"%>
<%@taglib uri='/WEB-INF/cewolf.tld' prefix='cewolf' %>
<head>
    <title><fmt:message key="employeesReport.title"/></title>

    <meta name="heading" content="<fmt:message key='employeesReport.heading'/>"/>
    <meta name="menu" content="RoleAdminPayment"/>
    <script type="text/javascript" src="<c:url value='/scripts/calendar/calendar.js'/>"></script>
    <script type="text/javascript" src="<c:url value='/scripts/calendar/lang/calendar-es.js'/>"></script>
    <script type="text/javascript" src="<c:url value='/scripts/calendar/calendar-setup.js'/>"></script>
    <script type="text/javascript">
        window.onload = function() {
            Calendar.setup({
                inputField: "dateStartID",
                ifFormat: "%d/%m/%Y",
                button: "dateStartID"
            });

            Calendar.setup({
                inputField: "dateEndID",
                ifFormat: "%d/%m/%Y",
                button: "dateEndID"
            });
        }
        function displayType(type){
            if(type == "1"){
                document.getElementById('perMonth').style.display = 'inline';
                document.getElementById('perYear').style.display = 'none';
            } else {
                document.getElementById('perYear').style.display = 'inline';
                document.getElementById('perMonth').style.display = 'none';
            }
        }
    </script>
</head>
<div id="help">
    <h2>
        <a href="<c:url value='helpEmployeesReport.html?decorate=false'/>"
           title="<fmt:message key="help.eR"/>"
           onclick="Modalbox.show(this.href, {title: this.title, width: 600}); return false;">
            <fmt:message key="help"/>
        </a>
    </h2>
</div>

<fieldset>
    <legend><fmt:message key="employeesReport.optionsReport"/></legend>
    <s:form action="generateEmployeesReport" method="get" validate="true" >
        <s:hidden name="decorate" value="false"/>
        <s:radio key="typeEmployeeChoice" list="typeEmployee" required="true" value="" />
        <s:radio key="typeComparationChoice" list="typeComparation" required="true" value="" />
        <s:radio key="typeReportChoice" list="typeReport" required="true" onclick="displayType(this.value);" value="" />
        <table id="perMonth" style="display: none;">
            <tr><td>
                    <s:textfield id="dateStartID" size="9" value="%{dateStart}" label="%{getText('typeReport.perMonth.dateStart')}"
                                 required="true" readonly="true" name="dateStart"/>
                </td><td>
                    <s:textfield name="dateEnd" id="dateEndID" value="%{dateEnd}" label="%{getText('typeReport.perMonth.dateEnd')}"
                                 size="9" required="true" readonly="true" />
            </td></tr>
        </table>
        <table id="perYear" style="display: none;">
            <tr><td>
                    <s:select id="yearStartID" list="numYearList" name="yearStart" value="%{yearStart}" label="%{getText('typeReport.perYear.yearStart')}"
                              listKey="label" listValue="label"
                              headerKey="" headerValue="%{getText('select')}"/>
                </td><td>
                    <s:select id="yearEndID" list="numYearList" name="yearEnd" value="%{yearEnd}" label="%{getText('typeReport.perYear.yearEnd')}"
                              listKey="label" listValue="label"
                              headerKey="" headerValue="%{getText('select')}"/>
            </td></tr>
        </table>
        <s:submit cssClass="button" key="button.generate" theme="ajax" targets="imageEmployeesReport"/>
    </s:form>
</fieldset>

<s:url id="imageGenerateUrl" action="ajaxEmployeesReport" >
    <s:param name="decorate" value="false" />
</s:url>

<s:div id="imageEmployeesReport" theme="ajax" href="%{imageGenerateUrl}" loadingText="%{getText('ajax.loading')}..."/>


